<template>
	<view>
		<view style="padding:40rpx">
			<view class="result">
				<view class="result1">
					保守型
				</view>
				<view class="result2">
					有效期至： 2022-03-01
				</view>
			</view>
			<view class="assessment">
				<view class="assessment1">
					<view class="assessment-1">
						<view class="assessment-11">
							风险承受能力
						</view>
						<view class="assessment-12">
							<view class="evaluationChart" style="background-color:#3476f1;"></view>
							<view class="evaluationChart" style="background-color:#3476f1;"></view>
							<view class="evaluationChart" style="background-color:#3476f1;"></view>
							<view class="evaluationChart"></view>
							<view class="evaluationChart"></view>
							<view class="evaluationChart"></view>
						</view>
					</view>
					<view class="assessment-1">
						<view class="assessment-11" style="margin-bottom: 40rpx;">
							期望投资收益
						</view>
						<view class="assessment-12">
							<view class="evaluationChart" style="background-color:#3476f1;"></view>
							<view class="evaluationChart" style="background-color:#3476f1;"></view>
							<view class="evaluationChart"></view>
							<view class="evaluationChart"></view>
							<view class="evaluationChart"></view>
							<view class="evaluationChart"></view>
						</view>
					</view>
				</view>
				<view class="assessment2">
					您的风险承受能力较低，适合投资低风险、中低风险产品；除此之外的中风险、中高风险、高风险产品超出您的风险承受能力，请谨慎选择
				</view>
			</view>			
		</view>
		<view class="changBox">
			<view class="changBox1">
				<label class="radio"><radio :checked="isChecked" @click="this.isChecked = !isChecked" color="#3476f1" />我已了解： 我是饱受型的投资者，本产品为低风险符合我的风险承受能力</label>
			</view>
				<button type="default" style="background-color:#3476f1; color: #ffffff;" @tap='buy'>继续购买</button>
				<button type="default" @tap='go'>暂不购买</button>
			
		</view>
	</view>
	
</template>

<script>
	export default{
		data(){
			return{
				isChecked:true
			}
		},methods:{
			go(){
				uni.switchTab({
					url:"/pages/wealth/wealth"
				})
			},
			buy(){
				uni.reLaunch({
					url:"/pages/information1/information1"
				})
			}
		}
	}
</script>

<style scoped>
	.result{
		text-align: center;
		border-bottom: 2rpx solid #F0F0F0;
		
	}
	.result .result1{
		font-size: 60rpx;
		color:#333333;
		font-weight:600;
		margin-top: 100rpx;
	}
	.result .result2{
		font-size: 28rpx;
		color:#666666;
		margin-top: 16rpx;
		margin-bottom: 60rpx;
	}
	.assessment{
		
	}
	.assessment .assessment1{
		border-bottom: 2rpx solid #F0F0F0;
	}
	.assessment .assessment1 .assessment-1{
		margin-top: 40rpx;
		display: flex;
		justify-content: space-between;
	}
	.assessment .assessment1 .assessment-1 .assessment-11{
		font-size: 24rpx;
		color: #666666;
	}
	.assessment .assessment1 .assessment-1 .assessment-12{
		display: flex;
		justify-content: space-between;
	}
	.assessment .assessment1 .assessment-1 .assessment-12 .evaluationChart{
		width: 58rpx;
		height: 4rpx;
		background-color: #cfcfcf;
		margin-left: 2rpx;
	}
	.assessment .assessment2{
		margin-top: 50rpx;
		margin-bottom: 50rpx;
		font-size: 24rpx;
		color: #666666;
	}
	.changBox{
		background-color: #f3ff3f3;
		padding: 40rpx;
	}
	.changBox .changBox1{
		margin-top: 50rpx;
		font-size: 24rpx;
		color: #999999;
		line-height: 36rpx;
	}
	.changBox button{
		margin-top: 40rpx;
	}
</style>
